import React, { useState } from "react";
import "@/layouts/Login.css";

function Login() {
  const [showElem, setshowElem] = useState(false);

  const goLogin = () => {
    setshowElem(true);
  };

  return (
    <div className="login_box">
      {/* 按钮 */}
      <button onClick={() => { goLogin()}} >
        登录/注册
      </button>
      <div
        className="Mask_box"
        style={{ display: showElem ? "block" : "none" }}
      >
        <div className="login_main">
            <div className="main_left">
              <img src="../src/images/login_left.png"/>
            </div>
            <div className="main_right">
              登录
            </div>
            {/* 关闭弹出层 */}
           <div className="down" onClick={()=>{setshowElem(false)}}>X</div>
        </div>
       
      </div>
    </div>
  );
}

export default Login;
